﻿/* ImageList40 */
.guruImageList40 {
    width: 100%;
    display:inline-block !important;
    font-family:Verdana, Geneva, Tahoma, sans-serif;    		
    font-size: 10pt !important;
    color: #000 !important;
}

ul.jsImageListControl{    
    margin: 0px !important;
    max-width: 100%;
    list-style-type:none;
    white-space:nowrap;
    overflow-y:hidden;    
    overflow-x:auto;      
}

ul.jsImageListControl li {
    width: 300px;
}

/*.jsImageListControl-image{
    height:100px;
}*/

ul.jsImageListControl li {
    position:relative;
    text-align:center;
    display:inline-block !important;
    padding-bottom:10px !important;
    padding-right: 10px;
}
ul.jsImageListControl li:last-child {
    padding-right: 0px !important;
}

div.jsImageListControl-group1, div.jsImageListControl-group2, div.jsImageListControl-group3, div.jsImageListControl-group4{
    /*line-height:25px;  !important;*/
    line-height:20px;
    text-align:center;    
    /*color:#000000 !important;*/
}
div.jsImageListControl-group1 {
    font-weight: bold; 
}
li.jsImageListControl-item div.jsImageListControl-group1{    
    background: -webkit-linear-gradient(rgba(0,102,255,1.0), rgba(0,102,255,0.3)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgba(0,102,255,1.0), rgba(0,102,255,0.3)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgba(0,102,255,1.0), rgba(0,102,255,0.3)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(rgba(0,102,255,1.0), rgba(0,102,255,0.3)); /* Standard syntax */        
}

/* selected items */
li.jsImageListControl-selectedListItem div.jsImageListControl-group1 {
    background: -webkit-linear-gradient(rgba(0,153,255,1.0), rgba(0,153,255,0.3)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgba(0,153,255,1.0), rgba(0,153,255,0.3)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgba(0,153,255,1.0), rgba(0,153,255,0.3)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(rgba(0,153,255,1.0), rgba(0,153,255,0.3)); /* Standard syntax */
}

/*invalid item*/
li.jsImageListControl-invalidItem  div.jsImageListControl-group1 {
    background-color: rgba(255,51,0,1.0);
    /*background: -webkit-linear-gradient(rgba(255,51,0,1.0), rgba(255,51,0,0.5));*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(rgba(255,51,0,1.0), rgba(255,51,0,0.5));*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(rgba(255,51,0,1.0), rgba(255,51,0,0.5));*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(rgba(255,51,0,1.0), rgba(255,51,0,0.5));*/ /* Standard syntax */
}
li.jsImageListControl-invalidItem div.jsImageListControl-inner{
    background-color: #f2dede;
    /*background: -webkit-linear-gradient(rgba(255,51,0,0.1), rgba(255,51,0,0.0));*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(rgba(255,51,0,0.1), rgba(255,51,0,0.0));*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(rgba(255,51,0,0.1), rgba(255,51,0,0.0));*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(rgba(255,51,0,0.1), rgba(255,51,0,0.0));*/ /* Standard syntax */
}

/*constrained item*/
li.jsImageListControl-constrainedItem  div.jsImageListControl-group1 {
    background-color: rgba(153,153,153,1.0);
    /*background: -webkit-linear-gradient(rgba(153,153,153,1.0), rgba(153,153,153,0.3));*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(rgba(153,153,153,1.0), rgba(153,153,153,0.3));*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(rgba(153,153,153,1.0), rgba(153,153,153,0.3));*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(rgba(153,153,153,1.0), rgba(153,153,153,0.3));*/ /* Standard syntax */
}
/*li.jsImageListControl-constrainedItem div.jsImageListControl-inner{
    background-color: rgba(204,204,204,0.2);
}*/
li.jsImageListControl-constrainedItem{
    opacity: 0.7 !important;
}
li.jsImageListControl-constrainedItem img{
    opacity: 0.5 !important;
}


div.jsImageListControl-group2 {
    background-color: silver !important;
    color:#000000 !important;
}

label.jsImageListControl-itemCount{
    z-index: 5;
    position: absolute;
    background-color: darkslategray;
    color: white;
    font-size: 10pt;
    padding: 0px 4px 0px 4px;
    margin-top: 5px;
    margin-left: 5px;
}

/*items in group 3 and group 4 have no default background color*/

/*  all characteristics will show up on their own line. to display on same line add   */
/*  to default each Group to group together on a line (ie: Group 1 on Line 1, Group 2 */
/*  on Line 2, Group 3 on Line 3, Group 4 on Line 4), add the following               */

/* div.jsImageListControl {                 */
/*     display:inline-block !important;     */
/*     margin-right:5px !important; */ /*optional. but will provide spacing between text of the characteristics*/       
/* }                                        */

/* -- ------------------------------------------------------ -- */
/* -- example to more selectively display characteristic     -- */
/* -- grouping on one line                                   -- */
/* -- ------------------------------------------------------ -- */
/* Price and Weight would be characteristic names */
/* div.jsImageListControl-Price, div.jsImageListControl-Weight{  */  
/*     display:inline-block !important;                          */
/* }                                                             */
/* div.jsImageListControl-Price{                                 */
/*     margin-right:5px !important; */ /* add margin to put a little space between the Price and Weight */
/* }                                                             */

/* -- ------------------------------------------------------ -- */
/* -- example to use CSS to add additional text to           -- */
/* -- characteristic                                         -- */
/* -- ------------------------------------------------------ -- */
/* -- Output: $ 9,999 (Weight 46 lbs)                        -- */
/* div.jsImageListControl-Price:before{    */
/*     content: "$ ";                      */
/* }                                       */
/*                                         */
/* div.jsImageListControl-Weight:before{   */
/*     content: " (";                      */
/* }                                       */
/* div.jsImageListControl-Weight:after{    */
/*     content: " lbs)";                   */
/* }                                       */


/*promotion style*/
div.jsImageListControl-promo-text{

}
div.jsImageListControl-promo-background {
    bottom: 5px;
    right: 5px;
    width:40px;
    height:40px;
    position:absolute;
    background-image:url(../images/dollar.png); 
    background-size:contain;
    background-repeat:no-repeat;
}

.jsImageListControl-promo .tooltip{
    
}

/*.jsImageListControl .tooltip.top .tooltip-arrow{*/
.jsImageListControl-promo .tooltip.top .tooltip-arrow{
    border:none !important;
}
/*.jsImageListControl .tooltip-inner{    */
.jsImageListControl-promo .tooltip-inner{
    padding:20px !important;        /* increase or decrease for size */
    font-size: 14px !important;
    margin-left: -50px !important;  /* remove this to center */

    /* modify this to set a different background color using a gradient */
    /*background: -webkit-linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* Standard syntax */

    /* modify this to set a background color (non-gradient) */
    /*background-color: blue;*/
}

/*recommended style*/
div.jsImageListControl-recommend-text{

}
div.jsImageListControl-recommend-background {
    top: 5px;
    right: 5px;
    width:50px;
    height:50px;
    position:absolute;
    background-image:url(../images/recommended_resize.png); 
    background-size:contain;
    background-repeat:no-repeat;
}

.jsImageListControl-recommend .tooltip{
    
}

.jsImageListControl-recommend .tooltip-arrow{
    border:none !important;
}
.jsImageListControl-recommend .tooltip-inner{    
    padding:10px !important;        /* increase or decrease for size */
    font-size: 12px !important;
    margin-left: -50px !important;  /* remove this to center */

    /* modify this to set a different background color using a gradient */
    /*background: -webkit-linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(rgba(255,139,8,1.0), rgba(255,139,8,0.8));*/ /* Standard syntax */

    /* modify this to set a background color (non-gradient) */
    background-color: blue;
}

a.bookmark{
    color: #000;
    text-decoration: none !important;
}

